<template>
	<view class="page">
		<view class="info-wrap">
			<view class="top-dack"></view>
			<view class="info tp-w690">
				<view class="info_top-wrap">
					<text class="type">拼车</text>
					<text class="time"> {{travelDate || ''}}</text>
					<view class="person">
						<uni-icons class="person-icon" type="person-filled" color="#CCCCCC" size="24"></uni-icons>
						<text>{{travelInfo.personNum || ''}}人</text>
					</view>
				</view>
				<view class="info_content-wrap">
					<view class="address-wrap">
						<view class="step-wrap">
							<view class="dot dot_from"></view>
							<view class="dot dot_to"></view>
						</view>
						<text class="from txt ellispsis1">{{travelInfo.fromArea || ''}}</text>
						<text class="to txt ellispsis1">{{travelInfo.toArea || ''}}</text>
						<view class="time-wrap">
							<text class="time"> <text style="color: #666;">备注：</text>{{travelInfo.remark || ''}}</text>
						</view>
					</view>
					<view class="ticket-wrap">
						<view class="ticket">
							<view class="price"><text style="font-size: 24rpx;">￥</text>{{travelInfo.price || ''}}</view>
						</view>
					</view>
				</view>
			</view>

		</view>

		<view class="common-wrap tp-w690">
			<view class="input-wrap">
				<view class="type">意向司机</view>
				<view class="input" @click="handleGoDriverList">
					<input type="text" disabled :value="curDriverObj.name" placeholder="请选择" />
					<uni-icons type="arrowright" size="20" color="#999"></uni-icons>
				</view>
			</view>
		</view>

		<view class="content-wrap tp-w690">
			<view class="rider_info-wrap">
				<!-- 当前选择乘车人列表S -->
				<view class="rider_list" v-if="riderPersionList.length">
					<view class="rider_item" v-for="(it_r,in_r) in riderPersionList" :key="in_r">
						<view class="l-wrap">
							<uni-icons type="trash" size="22" color="#ccc" @click="handleDelRider(it_r)"></uni-icons>
							<text class="name ellispsis1">{{it_r.passengerName}}</text>
							<text class="type">{{it_r.typeName}}</text>
							<text class="ID">{{it_r.certificateNumber}}</text>
						</view>
						<!-- <uni-icons  type="arrowright" size="22" color="#ccc"></uni-icons> -->
						<image @click="handleGoCommonAddRider(it_r)" class="tp-img32" src="../../static/imgs/icons/edit-icon.png" mode=""></image>
					</view>
				</view>
				<!-- 当前选择乘车人列表E -->

				<view class="common-btn chengcheren" @click="handleGoCarpoolAddRider">
					<view class="common-btn-con">
						<uni-icons type="plus" size="20" color="#fff"></uni-icons>
						<text class="txt">添加乘车人</text>
					</view>
				</view>
			</view>
		</view>

		<!-- 购买保险 S -->
		<view class="common-wrap tp-w690">
			<view class="input-wrap" v-for="(it_i, in_i) in insuranceList" :key="in_i" @click="handleChooseInsurance(it_i, in_i)">
				<view class="l-wrap">
					<view v-if="!it_i.choosed" class="icon">
						<image src="../../static/imgs/icons/choose0-icon.png" mode="aspectFill"></image>
					</view>
					<view v-else class="icon">
						<image src="../../static/imgs/icons/choose1-icon.png" mode="aspectFill"></image>
					</view>
					<view>购买保险<text class="terms" @click.stop="handleGoInsuranceDetail(it_i)">《{{it_i.name}}》</text></view>
				</view>
				<view class="price">￥{{it_i.price}}</view>
			</view>
		</view>
		<!-- 购买保险 E -->
		
		<view class="tp-pd30">
			<view class="level_align tp-br12 tp-h98 tp-bgf tp-ptb0lr30  tp-fz26" @click="isFp = isFp == 1 ? 0 : 1">
				<image v-if="isFp == 1"  class="tp-img32 tp-mr20" src="../../static/imgs/icons/choose0-icon.png" mode="aspectFill"></image>
				<image v-else class="tp-img32 tp-mr20" src="../../static/imgs/icons/choose1-icon.png" mode="aspectFill"></image>
				<view>是否开具发票</view>
			</view>
		</view>

		<view class="common-wrap tp-w690">
			<view class="input-wrap" @click="handleGoBusCouponList">
				<view class="type">优惠券</view>
				<view class="input">
					<input disabled type="text" :value="choosedBusCoupon.id ? (choosedBusCoupon.useScene ==1 ? `满${choosedBusCoupon.fullAmount}减${choosedBusCoupon.amount}` : `减${choosedBusCoupon.amount}`) : ''"
					 :placeholder="integralPlacholde" />
					<uni-icons type="arrowright" size="20" color="#999"></uni-icons>
				</view>
			</view>
			<!-- <view class="input-wrap">
				<view class="type">积分抵扣</view>
				<view class="input">
					<input type="number" :disabled="integral==0" v-model="usedIntegral" :placeholder="`最多可用${integral}积分`" @input="handleWatchUseIntegral" />
				</view>
			</view> -->
		</view>

		<view class="buy_description tp-w690" @click="handleChooseBuyDescription">
			<view v-if="!buyDescriptionStatus" class="icon">
				<image src="../../static/imgs/icons/choose0-icon.png" mode="aspectFill"></image>
			</view>
			<view v-else class="icon">
				<image src="../../static/imgs/icons/choose1-icon.png" mode="aspectFill"></image>
			</view>
			<view>
				请您仔细阅读
				<text class="terms">《拼车须知》</text>
				<!-- @click.stop="handleGoInsuranceDetail(it_n, 2)" -->
			</view>
		</view>

		<view class="submit-btn">
			<view class="price-wrap">
				<text>总价：</text>
				<text class="price">￥{{totalMoney}}</text>
			</view>
			<view class="r-wrap">
				<view class="btn" @click="handleSubmitOrder">提交订单</view>
			</view>
		</view>

		<CommonPay ref="commonPay" :price="totalMoney" :orderInfo="orderInfo" @cancle="noPay" @closeK="noPay" @payMoney="payMoney"
		 @wechatPaySuccess="wechatPaySuccess"></CommonPay>
		<CommonTip ref="tip" :config="tipConfig" :orderInfo="orderInfo" @confirm="handleGoCommonAddRider(curRiderPersonInfo)"></CommonTip>

		<Notice ref="notice" :noticeInfo="noticeInfo" :isbtn="buyDescriptionStatus" @NoticeOk="buyDescriptionStatus = true"></Notice>
	</view>
</template>

<script>
	import $DB from '../../utils/debounce.js'
	import CommonPay from '@/components/common/common-pay.vue'
	import CommonTip from '@/components/common/common-tip.vue'
	import Notice from '@/components/common/notice.vue'
	import utils from '../../utils/utils.js'
	var QQMapWX = require('@/utils/qqmap-wx-jssdk/qqmap-wx-jssdk.min.js');
	var qqmapsdk;
	export default {
		components: {
			CommonPay,
			CommonTip,
			Notice
		},
		data() {
			return {
				curDriverObj: {}, // 当前所选意向司机
				buyDescriptionStatus: false, // 购买须知
				curPayType: 'balance', // 当前支付方式：balance余额 | 微信wechat
				chooseInsurance: true, // 用户是否选择保险服务
				travelInfo: {}, // 出行详情
				insuranceList: [], // 保险列表
				noticeList: [], // 须知列表
				noticeInfo: {}, // 须知信息
				integral: 0, // 个人总积分
				usedIntegral: '', // 使用的积分
				exchangeRate: '', // 积分兑换汇率
				couponList: [], // 优惠券列表
				distance: 1, // 距离
				orderNo: '', // 订单号
				isFp: 1, // 	是否需要发票 0.是 1.否
				curRiderPersonInfo: {}, // 需要补全的乘车人信息
				tipConfig: {
					content: '请先补全乘车人信息再进行购买车牌',
					btnText: '确定',
					tit: '温馨提示'
				},
				// riderPersionList: [], // 乘车人员列表
			};
		},
		onLoad(opt) {
			this.travelInfo = opt && opt.travelInfo && JSON.parse(opt.travelInfo)
			this.getRiderList(); // 获取乘车人列表
			this.initList()
			this.initMap()
			this.getInsuranceList()
		},
		onShow() {
			this.getCurDriverObj()
			// this.getBusCouponList() // 判断有么有优惠券可选择
			// this.riderPersionList = this.$store.getters.getRiderList
			// this.$forceUpdate()
			this.riderPersionList.forEach(async (item, index) => {
				let istrue = await this.checkRiderUserInfo(item);
				if (!istrue) {
					this.riderPersionList.splice(index, 1)
				}
			})
		},
		computed: {
			travelDate() {
				let month = this.travelInfo.dateObj && this.travelInfo.dateObj.month
				let day = this.travelInfo.dateObj && this.travelInfo.dateObj.day
				let hour = this.travelInfo.dateObj && this.travelInfo.dateObj.hour && this.travelInfo.dateObj.hour.value
				let minute = this.travelInfo.dateObj && this.travelInfo.dateObj.minute && this.travelInfo.dateObj.minute.value
				return month + '月' + day + '日' + ' ' + hour + ':' + minute
			},
			integralPlacholde() { // 积分选择提示
				return this.couponList.length === 0 ? '暂无优惠券可用' : '点我选择优惠券'
			},
			// 优惠前的价格
			originalPrice(){
				let money = 0;
				money = Number(money) - Number(this.usedIntegral) * Number(this.exchangeRate)
				if (Number(this.riderPersionList.length) > 0 && Number(this.riderPersionList.length) < Number(this.travelInfo.pinNumber)) {   // 小于起订人数
					if(Number(this.distance) > Number(this.travelInfo.startMile)){  // 大于起步公里数
						money += Math.round(Number(this.travelInfo.startPrice) *  Number(this.travelInfo.pinNumber) * 100 + this.travelInfo.singlePrice * (this.distance - Number(this.travelInfo.startMile)) * Number(this.travelInfo.pinNumber) * 100)
					} else {   // 小于起步公里数
						money += Math.round(Number(this.travelInfo.startPrice) *  Number(this.travelInfo.pinNumber)  * 100) 
					}
				} else if (Number(this.riderPersionList.length) > 0 && Number(this.riderPersionList.length) >= Number(this.travelInfo.pinNumber)) {  // 大于起订人数
					this.riderPersionList.forEach(per => {
						if(Number(this.distance) > Number(this.travelInfo.startMile)){  // 大于起步公里数
							money += Math.round(Number(this.travelInfo.startPrice) *   Number(per.rate)  + this.travelInfo.singlePrice *  Number(per.rate) * (this.distance - Number(this.travelInfo.startMile)))
						} else { // 小于起步公里数
							money += Math.round(Number(this.travelInfo.startPrice) *   Number(per.rate)) 
						}
					})
				}
				
				this.insuranceList.forEach(item => {
					if (item.choosed) {
						money += Number(item.price) * this.riderPersionList.length * 100
					}
				})
				return money / 100 >= 0 ? (money / 100).toFixed(2) : 0
			},
			totalMoney() {
				let money = 0;
				// let riderNum = this.riderPersionList.length > 1 ? this.riderPersionList.length : 2
				money = Number(money) - Number(this.usedIntegral) * Number(this.exchangeRate)
				/*
				小于人数
						大于起步公里数
							起步价 * 起订人数 + (剩余公里数) * 单价 * 起订人数
						小于公里数
							起步价 * 起订人数
				大于人数
						大于公里数
							起步价 * 人数 +  剩余公里数 * 单价 * 每个人的比例
						小于起步公里数
							起步价 * (每个人的比例)
				*/
				if (Number(this.riderPersionList.length) > 0 && Number(this.riderPersionList.length) < Number(this.travelInfo.pinNumber)) {   // 小于起订人数
					if(Number(this.distance) > Number(this.travelInfo.startMile)){  // 大于起步公里数
						money += Math.round(Number(this.travelInfo.startPrice) *  Number(this.travelInfo.pinNumber) * 100 + this.travelInfo.singlePrice * (this.distance - Number(this.travelInfo.startMile)) * Number(this.travelInfo.pinNumber) * 100)
					} else {   // 小于起步公里数
						money += Math.round(Number(this.travelInfo.startPrice) *  Number(this.travelInfo.pinNumber)  * 100) 
					}
					// money += Number(this.travelInfo.pinNumber) * this.travelInfo.singlePrice * this.distance * 100   // 加起步价之前的计算方式
				} else if (Number(this.riderPersionList.length) > 0 && Number(this.riderPersionList.length) >= Number(this.travelInfo.pinNumber)) {  // 大于起订人数
					this.riderPersionList.forEach(per => {
						if(Number(this.distance) > Number(this.travelInfo.startMile)){  // 大于起步公里数
							money += Math.round(Number(this.travelInfo.startPrice) *   Number(per.rate)  + this.travelInfo.singlePrice *  Number(per.rate) * (this.distance - Number(this.travelInfo.startMile)))
						} else { // 小于起步公里数
							money += Math.round(Number(this.travelInfo.startPrice) *   Number(per.rate)) 
						}
						// money += per.rate * this.travelInfo.singlePrice * this.distance  // 加起步价之前的计算方式
					})
				}
				// let money = Number(this.travelInfo.singlePrice) * 100 * riderNum * this.distance - Number(this.usedIntegral) * Number(this.exchangeRate)
				
				this.insuranceList.forEach(item => {
					// console.log(this.insuranceList);
					// console.log(this.riderPersionList);
					if (item.choosed) {
						money += Number(item.price) * this.riderPersionList.length * 100
					}
				})

				let {
					fullAmount,
					amount
				} = this.choosedBusCoupon
				if (this.choosedBusCoupon.useScene == 1) { // 判断是否属于满减
					if (money >= Number(fullAmount) * 100) {
						money = money - Number(amount) * 100
					}
				} else if (this.choosedBusCoupon.useScene == 0) {
					money = money - Number(amount) * 100
				}
				money = Math.round(money)
				return money / 100 >= 0 ? (money / 100).toFixed(2) : 0
			},
			riderPersionList() {
				return this.$store.getters.getRiderList
			},
			orderInfo() {
				let o = {
					orderNo: this.orderNo,
					type: 2
				}
				return o
			},
			choosedBusCoupon: { // // 获取选择的班车优惠券
				get() {
					return this.$store.getters.getChoosedBusCoupon
				},
				set() {}

			}
		},
		watch: {
			totalMoney() {
				// if (this.isUseCoupon == 0) {
				// this.getBusCouponList()
				// }
				if (this.riderPersionList.length == 0) {
					this.couponList = []
					this.choosedBusCoupon = {}
				}
			},
			originalPrice() {
				this.getBusCouponList()
			}
		},
		methods: {
			//  获取乘客完整信息
			getRiderList() {
				// this.page.pageNum = 1
				let
					api = this.$api.getRiderList + '?scene=1'

				let pageSize = 20,
					pageNum = 1;

				this.$http.get(api, {
					pageSize,
					pageNum
				}).then(res => {
					if (res.code === 200) {
						res.data.result.forEach(item => {
							if (item.isBenren == 0) {
								this.$store.commit('upRiderList', item)
							}
						})
					}
				})
			},
			wechatPaySuccess() {
				this.$refs.commonPay.close()
				uni.showToast({
					title: '支付成功'
				})
				uni.redirectTo({
					url: 'success.order?id=' + this.orderNo + '&type=carpool'
				});
			},
			initMap() {
				qqmapsdk = new QQMapWX({
					key: 'C7JBZ-VQD6D-BVZ4C-PHTJO-HNPSF-ORFT5'
				});
				// #ifdef MP-WEIXIN
				this.getDistance()
				// #endif

				// #ifdef H5
				this.H5pointJuli()
				// #endif
			},
			// 取消支付
			noPay() {
				uni.reLaunch({
					// url: '/pagesUser/order/carpool.orderList',
					url: '/pagesUser/order/carpool.orderDetail?orderStatus=toBePaid&id=' + this.orderNo
				});
			},
			// #ifdef H5
			
			// h5计算距离
			H5pointJuli() {
				// const {
				// 	fromObj,
				// 	toObj
				// } = this.travelDetailObj;
				let _this = this
				let formGet = this.travelInfo.fromObj.lat + ',' + this.travelInfo.fromObj.lng
				let toGet = this.travelInfo.toObj.lat + ',' + this.travelInfo.toObj.lng
				this.$http.get(this.$api.pointJuli + '?from=' + formGet + '&to=' + toGet).then(res => {
					if (res.data.message == 'query ok') {
						_this.distance = res.data.result.rows[0].elements[0].distance / 1000
					}
				})
			},
			// #endif
			// #ifdef MP-WEIXIN
			getDistance() {
				const {
					fromObj,
					toObj
				} = this.travelInfo;
				let _this = this
				qqmapsdk.calculateDistance({
					mode: 'driving',
					from: {
						latitude: fromObj.lat,
						longitude: fromObj.lng,
					},
					to: [{
						latitude: toObj.lat,
						longitude: toObj.lng,
					}],
					success(res) {
						if (res.message == 'query ok') {
							_this.distance = res.result.elements[0].distance / 1000
						}
					}
				})
			},
			// #endif
			// 检查乘车人信息是否完整
			async checkRiderUserInfo(item) {
				let ret = false
				await this.$http.get(this.$api.checkRiderInfo + '?id=' + item.id + '&scene=' + this.scene).then(res => {
					if (res.code === 2020) { // 判断当前所选乘客信息是否完整 （2020不完整|200完整）
						this.curRiderPersonInfo = item
						this.$refs.tip.show()
						// this.handleGoCommonAddRider(item)
						ret = false
					} else if (res.code == 200) {
						ret = true
					}
				})
				return ret
			},
			handleGoDriverList() {
				uni.navigateTo({
					url: '../../pagesTravel/driverList?curDriverId=' + this.curDriverObj.id + '&type=2'
				});
			},
			handleGoBusAddPickuperDetail(item) { // 去修改接送人信息
				uni.navigateTo({
					url: '../../pagesTravel/bus.addPickuper?id=' + item.id
				});
			},
			handleDelRider(item) {
				this.riderPersionList.forEach((it_, in_) => {
					if (item.id === it_.id) {
						this.$store.commit('delRiderList', in_)
					}
				})
			},
			handleGoCarpoolAddRider() { // 此处判断账号中是否有乘车人历史信息，
				if (this.riderPersionList.length >= this.travelInfo.personNum) return uni.showToast({
					title: '当前要添加乘客数量超出预选！',
					icon: 'none'
				})
				this.$http.get(this.$api.getCommonRiderList).then(res => {
					if (res.code === 200) {
						if (res.data.result.length) {
							uni.navigateTo({
								url: '../../pagesTravel/riderList?isBus=2&scene=1&maxNum=' + this.travelInfo.personNum + '&shiftsId=-1'
							});
						} else {
							uni.navigateTo({
								// url: '../../pagesTravel/common.addRider'
								url: '../../pagesTravel/bus.addRider?scene=1&id=undefined'
							});
						}
					}
				})
			},
			scrollTo(el) {
				uni.createSelectorQuery().select(el).boundingClientRect(data => { //目标节点
					// uni.createSelectorQuery().select(".search-address-list").boundingClientRect((res) => { //最外层盒子节点
					uni.pageScrollTo({
						duration: 0, //过渡时间必须为0，uniapp bug，否则运行到手机会报错
						scrollTop: data.top, //滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离
					})
					// }).exec()
				}).exec();
			},
			handleSubmitOrder() { // 提交订单
				const D = this.travelInfo.dateObj.date.value || this.travelInfo.dateObj.date
				const T = (this.travelInfo.dateObj.hour.value || this.travelInfo.dateObj.hour) + ':' + (this.travelInfo.dateObj.minute
					.value || this.travelInfo.dateObj.minute) + ':00'
				const str = D + ' ' + T
				const countTime = utils.getCountDownTime(str, 0)
				if (!this.buyDescriptionStatus) {
					this.scrollTo('.buy_description')
					return uni.showToast({
						title: '请仔细阅读并确认《拼车须知》',
						icon: 'none'
					})
				}
				if (!countTime) {
					return uni.showToast({
						title: '请重新选择出发时间',
						icon: 'none'
					})
				}

				if (this.riderPersionList.length != this.travelInfo.personNum) {
					this.scrollTo('.chengcheren')
					return uni.showToast({
						title: '请添加和预选相一致的乘客数量！',
						icon: 'none'
					})
				}


				const {
					personNum: number,
					price,
					fromArea: startStation,
					toArea: endStation,
					fromObj,
					toObj,
					remark
				} = this.travelInfo;

				let date = this.travelInfo.dateObj
				const time = `${date.year}-${date.month}-${date.day} ${date.hour.value}:${date.minute.value}:00`

				let passengerIds_arr = []
				this.riderPersionList.forEach(item => {
					passengerIds_arr.push(item.id)
				})
				const passengerIds = passengerIds_arr.join() || null
				if (!passengerIds) {
					return uni.showToast({
						title: '请选择乘乘车人',
						icon: 'none'
					})
				}

				let insuranceIds_arr = []
				this.insuranceList.forEach(item => {
					if (item.choosed) {
						insuranceIds_arr.push(item.id)
					}
				})
				const insuranceIds = insuranceIds_arr.join() || null

				const couponId = this.choosedBusCoupon.id || null

				const balance = this.usedIntegral || 0

				const driverId = this.curDriverObj.id || null

				const frontTotal = this.totalMoney || 0

				const pincheSimpleVo = {
					time,
					number: this.riderPersionList.length,
					price,
					startStation,
					endStation,
					goLat: fromObj.lat,
					goLng: fromObj.lng,
					endLat: toObj.lat,
					endLng: toObj.lng,
					remark,
					mile: this.distance,
				}
				const _this = this
				// #ifdef MP-WEIXIN
				uni.requestSubscribeMessage({
					tmplIds: ['jT4idTW1Jb_UNM1PI2mPSIttc26qnirW8LGuH_kjx7s'],
					success(res) {
						_this.submitWxNotifyConfirm('jT4idTW1Jb_UNM1PI2mPSIttc26qnirW8LGuH_kjx7s', res[
							'jT4idTW1Jb_UNM1PI2mPSIttc26qnirW8LGuH_kjx7s'])
						// #endif
						uni.showLoading({
							title: '提交中...',
							mask: true
						})
						_this.$http.post(_this.$api.submitCarpoolOrder, {
							pincheSimpleVo,
							passengerIds,
							insuranceIds,
							couponId,
							driverId,
							frontTotal,
							balance,
							isFp: _this.isFp,
						}).then(res => {
							uni.hideLoading()
							if (res.code === 200) {
								_this.$refs.commonPay.show()
								_this.orderNo = res.data.orderNo
							}
						})
						// #ifdef MP-WEIXIN
					}
				})
				// #endif



			},
			handleChoosePayType(type) {
				this.curPayType = type
			},
			hancleClosePayTypePopup() {
				this.$refs.payPopup.close()
			},
			// 去修改乘车人
			handleGoCommonAddRider(item) {
				uni.navigateTo({
					url: '../../pagesTravel/bus.addRider?id=' + item.id + '&scene=1'
				});
			},
			handleGoInsuranceDetail(item, type) { // 跳转到保险详情
				let obj = {
					type: 1,
					id: item.id,
					title: item.name || item.title
				}
				if (type) {
					obj.type = type
				}
				uni.navigateTo({
					url: '../../pagesTravel/serviceDetail?info=' + JSON.stringify(obj),
				});
			},
			handleChooseBuyDescription() {
				// this.buyDescriptionStatus = !this.buyDescriptionStatus
				this.$http.get(this.$api.orderText, {
					type: 12,
				}).then(res => {
					if (res.code === 200) {
						this.noticeInfo = res.data.list[0]
						this.$refs.notice.show()
					}
				})
			},
			handleGoInsuranceDetail(item, type) { // 跳转到保险详情
				let obj = {
					type: 1,
					id: item.id,
					title: item.name || item.title
				}
				if (type) {
					obj.type = 2
				}
				uni.navigateTo({
					url: '../../pagesTravel/serviceDetail?info=' + JSON.stringify(obj),
				});
			},
			handleGoBusCouponList() { //跳转到班车优惠券列表
				// if (!this.riderPersionList.length) return
				if (!this.couponList.length) return
				if(this.originalPrice === 0) return
				// this.$http.get(this.$api.getCommonCouponList + `?type=2&totalPrice=${this.totalMoney}`).then(res => { // 检查有无优惠券
				// 	if (res.code === 200) {
				// 		this.couponList = res.data
				// 		if (!this.couponList.length) return
				const couponInfo = JSON.stringify({
					type: 2,
					totalPrice: this.originalPrice,
					shopId: -1
				})
				uni.navigateTo({
					url: '../../pagesTravel/bus.couponList?couponInfo=' + couponInfo
				});
				// 	}
				// })
			},

			getCurDriverObj() {
				this.curDriverObj = { ...this.$store.getters.getChoosedDriverObj
				}
			},
			initList() { // 清空列表
				this.$store.commit('delRiderList')
				this.$store.commit('delChoosedDriverObj')
				this.$store.commit('delChoosedBusCoupon')
			},
			payMoney(pwd) {
				this.$http.post(this.$api.payCarpoolOrder, {
					orderNo: this.orderNo,
					payWord: pwd
				}).then(res => {
					if (res.code === 200) { // 密码正确，支付成功
						// this.$refs.commonPay.closeKeyBoard()
						this.$refs.commonPay.finishCloseKeyBoard()
						uni.reLaunch({
							url: 'success.order?id=' + this.orderNo + '&type=carpool'
						});
					} else if (res.code == 2012) {
						// uni.navigateTo({
						// 	url: '/pagesUser/editPayPwd?type=0'
						// });
					}
				})
			},
			handleChooseInsurance(item, i) { // 选择保险服务
				item.choosed = !item.choosed
				this.$set(this.insuranceList, i, item)
			},
			getInsuranceList() { // 获取保险列表
				this.$http.get(this.$api.getInsuranceList).then(res => {
					if (res.code === 200) {
						this.insuranceList = res.data.insurance
						this.insuranceList.map(item => {
							item.choosed = true
						})
						this.noticeList = res.data.textDescription
						this.integral = res.data.jifen
						this.exchangeRate = res.data.rate
					}
				})
			},
			handleWatchUseIntegral(e) { // 监听用户输入的积分
				if (Number(e.detail.value) > this.integral) {
					setTimeout(() => {
						this.usedIntegral = this.integral
					}, 100)
				}
			},
			getBusCouponList() { // 获取班车优惠券列表
				this.$http.get(this.$api.getCommonCouponList + `?type=2&totalPrice=${this.originalPrice}&shopId=-1`).then(res => {
					if (res.code === 200) {
						this.couponList = res.data
						if (!res.data.length) {
							this.$store.commit('delChoosedBusCoupon')
							return
						}
						let {
							fullAmount,
							amount
						} = this.choosedBusCoupon
						if (this.choosedBusCoupon.useScene == 1) { // 判断是否属于满减
							if (Number(this.originalPrice) < Number(fullAmount)) {
								this.$store.commit('delChoosedBusCoupon')
							}
						} else if (this.choosedBusCoupon.useScene == 0) {
							if (Number(this.originalPrice) < Number(amount)) {
								this.$store.commit('delChoosedBusCoupon')
							}
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		padding-top: 362rpx;

		/deep/.input-placeholder {
			font-size: 30rpx;
			font-weight: normal;
			color: #ccc;
		}
	}

	.info-wrap {
		height: 342rpx;
		background: #f5f5f5;
		position: fixed;
		/* #ifdef H5 */
		top: 44px;
		/* #endif */
		/* #ifdef MP-WEIXIN */
		top: 0;
		/* #endif */
		left: 0;
		right: 0;
		z-index: 9;

		.top-dack {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			height: 90rpx;
			background-color: $blue;
			z-index: -1;
		}

		.info {
			position: absolute;
			top: 20rpx;
			left: 0;
			right: 0;
			height: 342rpx;
			background: #fff;
			border-radius: 12rpx;
			padding: 40rpx;
			box-sizing: border-box;
			z-index: 9;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			overflow: hidden;

			.info_top-wrap {
				display: flex;
				align-items: center;
				font-size: 26rpx;
				font-size: 30rpx;

				.type {
					padding: 12rpx;
					background-color: #FFF2E0;
					color: $yellow;
					font-size: 22rpx;
					border-radius: 8rpx;
				}

				.time {
					padding: 0 74rpx 0 20rpx;
				}

				.person {
					.person-icon {
						margin-right: 20rpx;
					}
				}
			}

			.info_content-wrap {
				display: flex;
				flex: 1;
				justify-content: space-between;
				padding-top: 20rpx;

				.address-wrap {
					display: flex;
					flex: 1;
					flex-direction: column;
					justify-content: space-between;
					font-size: 30rpx;
					font-weight: bold;
					position: relative;

					.step-wrap {
						display: flex;
						justify-content: space-between;
						flex-direction: column;
						height: 90rpx;
						position: absolute;
						top: 10rpx;
						left: 0rpx;

						&::before {
							content: '';
							position: absolute;
							left: 50%;
							transform: translateX(-50%);
							height: 100%;
							width: 1px;
							background-color: #ccc;
						}

						.dot {
							height: 20rpx;
							width: 20rpx;
							border: 1px solid #ccc;
							border-radius: 50%;
							position: relative;

							&::before {
								content: '';
								position: absolute;
								left: 50%;
								top: 50%;
								transform: translate(-50%, -50%);
								height: 100%;
								width: 100%;
								border-radius: 50%;
								background-color: #fff;
							}
						}
					}

					.txt {
						margin-bottom: 29rpx;
					}

					.from,
					.to {
						padding-left: 44rpx;
					}

					.time-wrap {
						padding-left: 44rpx;
						font-size: 30rpx;
						font-weight: normal;
						display: flex;
						align-items: center;
					}
				}

				.ticket-wrap {
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					text-align: right;
					// width: 100rpx;

					.price {
						margin-top: 20rpx;
						font-size: 36rpx;
						font-weight: bold;
						color: #FF4A37;
					}
				}
			}
		}

	}

	.common-wrap {
		border-radius: 12rpx;
		background-color: #fff;
		padding: 0 30rpx;
		box-sizing: border-box;
		margin-top: 20rpx;

		.input-wrap {
			height: 100rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1px solid #ebebeb;
			font-size: 30rpx;

			&:last-child {
				border: none;
			}

			.l-wrap {
				display: flex;
				align-items: center;

				.icon {
					display: inline-block;
					height: 30rpx;
					width: 30rpx;
					margin-right: 20rpx;
				}

				.terms {
					color: $blue;
				}
			}

			.ul_service {
				display: flex;

				.li_service {
					display: flex;
					align-items: center;
					font-size: 30rpx;
					margin-left: 80rpx;

					.txt {
						margin-left: 20rpx;
					}
				}
			}

			.type {
				font-size: 30rpx;
			}

			.input {
				flex: 1;
				text-align: right;
				font-size: 30rpx;
				display: flex;

				input {
					padding-right: 6rpx;
				}
			}
		}
	}

	.content-wrap {
		margin-top: 20rpx;

		.rider_info-wrap {
			width: 690rpx;
			background: #fff;
			border-radius: 12rpx;
			padding: 40rpx 30rpx;
			box-sizing: border-box;

			.rider_list {
				margin-bottom: 40rpx;

				.rider_item {
					height: 100rpx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					border-bottom: 1px solid #ebebeb;

					.l-wrap {
						display: flex;
						align-items: center;
						font-size: 28rpx;

						.name {
							font-size: 30rpx;
							padding: 0 10rpx 0 20rpx;
							width: 120rpx;
						}

						.type {
							padding-right: 40rpx;
						}
					}
				}
			}

			.common-btn {
				width: 520rpx;

				display: flex;
				align-items: center;
				justify-content: space-evenly;

				.common-btn-con {
					display: flex;
					align-items: center;

					.txt {
						margin-left: 20rpx;
					}
				}
			}
		}
	}

	.buy_description {
		position: relative;
		font-size: 28rpx;
		padding: 30rpx 0 147rpx 50rpx;
		box-sizing: border-box;
		line-height: 50rpx;

		.icon {
			display: inline-block;
			height: 30rpx;
			width: 30rpx;
			margin-right: 20rpx;
			position: absolute;
			top: 36rpx;
			left: 0;
		}

		.terms {
			color: $blue;
		}
	}

	.submit-btn {
		display: flex;
		align-items: center;
		padding: 0 30rpx;
		background-color: #fff;
		height: 98rpx;
		font-size: 26rpx;
		color: #666;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 2;

		.price-wrap {
			flex: 1;
			display: flex;
			align-items: center;

			.price {
				color: $red;
				font-size: 36rpx;
				margin-left: 24rpx;
			}
		}

		.r-wrap {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.btn {
				width: 240rpx;
				height: 72rpx;
				line-height: 72rpx;
				background: $yellow;
				border-radius: 12rpx;
				color: #fff;
				text-align: center;
				font-size: 32rpx;
			}
		}
	}

	.common-btn {
		box-shadow: none;
	}

	.pay_popup-wrap {
		width: 690rpx;
		margin: 0 auto;
		background-color: #fff;
		padding-bottom: 74rpx;
		border-radius: 12rpx;

		.tit-wrap {
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			position: relative;
			font-size: 32rpx;
			border-bottom: 1px solid #EBEBEB;

			.close-icon {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: 20rpx;
			}
		}

		.center-wrap {
			display: flex;
			align-items: center;
			flex-direction: column;

			.price {
				padding: 40rpx 0 20rpx;
				font-size: 48rpx;
				color: $red;
			}

			.input-wrap {
				width: 630rpx;
				margin: 0 auto;
				height: 88rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-size: 28rpx;
				border-bottom: 1px solid #ebebeb;

				.l-wrap {
					display: flex;
					align-items: center;
					font-size: 28rpx;

					.icon {
						height: 48rpx;
						width: 48rpx;
						margin-right: 20rpx;
					}
				}

				.r-wrap {
					display: flex;
					align-items: center;

					.num {
						color: #666;
						font-size: 28rpx;
					}

					.choose-icon {
						margin-left: 20rpx;
					}
				}
			}
		}

		.btn {
			width: 600rpx;
			margin: 80rpx auto 0;
			height: 88rpx;
			line-height: 88rpx;
			background: $blue;
			border-radius: 8rpx;
			font-size: 32rpx;
			color: #fff;
			text-align: center;
		}
	}
</style>
